<!-- 异常名单 -->
<template>
	<view class="card d-flex">
		<view class="card_head relative d-flex mb-30">
			<text class="card_head_title relative">异常名单</text>
		</view>

		<view class="card_content d-flex mb-20">

			<view class="card_item d-flex">
				<view class="card_item_head d-flex mb-50">
					<text class="card_item_head_title bold relative">银行失联异常行为</text>
				</view>

				<view class="info d-flex">
					<view class="info_item d-flex">
						<text class="info_item_label info_item_txt">行为类型</text>
						<text class="info_item_val info_item_txt">异常情况</text>
					</view>

					<view class="info_item d-flex">
						<text class="info_item_label info_item_txt">银行失恋异常</text>
						<text class="info_item_val info_item_txt">无异常</text>
					</view>

					<view class="info_item d-flex">
						<text class="info_item_label info_item_txt">银行90天以内异常</text>
						<text class="info_item_val info_item_txt">2次</text>
					</view>

					<view class="info_item d-flex">
						<text class="info_item_label info_item_txt">银行90天以上异常</text>
						<text class="info_item_val info_item_txt">无异常</text>
					</view>
				</view>

				<uv-divider :dashed="true"></uv-divider>

				<view class="info d-flex">
					<view class="info_item d-flex">
						<text class="info_item_label info_item_txt">行为类型</text>
						<text class="info_item_val info_item_txt">查询时间范围</text>
						<text class="info_item_val info_item_txt">异常情况</text>
					</view>

					<view class="info_item d-flex">
						<text class="info_item_label info_item_txt">网络小贷</text>
						<text class="info_item_val info_item_txt">3年内</text>
						<text class="info_item_val info_item_txt">无异常</text>
					</view>

					<view class="info_item d-flex">
						<text class="info_item_label info_item_txt">地方小贷</text>
						<text class="info_item_val info_item_txt">4年内</text>
						<text class="info_item_val info_item_txt">无异常</text>
					</view>

					<view class="info_item d-flex">
						<text class="info_item_label info_item_txt">消费金融公司</text>
						<text class="info_item_val info_item_txt">1年内</text>
						<text class="info_item_val info_item_txt">无异常</text>
					</view>

					<view class="info_item d-flex">
						<text class="info_item_label info_item_txt">融资租赁公司</text>
						<text class="info_item_val info_item_txt">4年内</text>
						<text class="info_item_val info_item_txt">无异常</text>
					</view>

					<view class="info_item d-flex">
						<text class="info_item_label info_item_txt">汽车金融公司</text>
						<text class="info_item_val info_item_txt">4年内</text>
						<text class="info_item_val info_item_txt">无异常</text>
					</view>

					<view class="info_item d-flex">
						<text class="info_item_label info_item_txt">其他金融公司</text>
						<text class="info_item_val info_item_txt">4年内</text>
						<text class="info_item_val info_item_txt">无异常</text>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script setup>

</script>

<style lang="scss" scoped>
	.card {
		flex-direction: column;

		&_content {
			flex-direction: column;
		}

		&_item {
			width: 100%;
			flex-direction: column;

			&_head {
				align-items: center;
				justify-content: space-between;

				&_title {
					padding-left: 30rpx;
					color: #000;

					font: {
						size: 24rpx;
					}

					&:before {
						content: '';
						position: absolute;
						left: 0;
						top: 0;
						height: 110%;
						width: 6rpx;
						background-color: #6642EA;
						border-radius: 8rpx;
					}
				}

				&_describe {
					color: #6C7282;

					font: {
						size: 24rpx
					}
				}
			}

			&_list {
				align-items: center;

				&_txt {
					color: #6C7282;

					font: {
						size: 26rpx
					}
				}

				&_val {
					font: {
						size: 26rpx
					}
				}
			}
		}

		.info {
			flex-direction: column;

			&_item {
				padding: 35rpx 50rpx;
				align-items: center;
				justify-content: space-between;

				&:nth-of-type(even) {
					background: linear-gradient(to right, #F4F6FF, #FFF5F8);
				}

				&_txt {
					color: #6C7282;

					font: {
						size: 24rpx
					}
				}
			}
		}
	}
</style>